<div class="row">
	<div class="col-md-12">
		<ol class="breadcrumb">
			<li>
				<a href="#" onclick="toHome()">
					主页
				</a>
			</li>
			<li>
				<a href="#" class="toList" onclick="toCounponList()">
					通兑卡列表
				</a>
			</li>
			<li class="active">
				通兑卡详情
			</li>
		</ol>
	</div>
</div>
<form role="form" class="form-horizontal">
	<div class="row page-cont">
		<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 cont-top">
			<div class="panel panel-white">
				<div class="panel-heading">
					<h4 class="panel-title">
						<span class="title-text">通兑卡查看</span>
					</h4>
					<div class="panel-tools">
						<div class="dropdown">
							<a data-toggle="dropdown" class="btn btn-xs dropdown-toggle btn-transparent-grey">
								<i class="fa fa-cog"></i>
							</a>
							<ul class="dropdown-menu dropdown-light pull-right" role="menu">
								<li>
									<a class="panel-collapse collapses" href="#"><i class="fa fa-angle-up"></i> <span>折叠</span> </a>
								</li>
								<li>
									<a class="panel-expand" href="#">
										<i class="fa fa-expand"></i> <span>全屏</span>
									</a>
								</li>
							</ul>
						</div>
						<a class="btn btn-xs btn-link panel-close" href="#">
							<i class="fa fa-times"></i>
						</a>
					</div>
				</div>
				<div class="panel-body">
					<div class="panel-cont">
					    <label>卡号：</label>
				   		<input type='text' class='codeNum' />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
				    	<button type="button" class="btn btn-primary btn-sm inquire-btn">查询</button>
			  		</div>	
					<table class="table table-bordered table-hover">
						<thead>
							<tr>
								<th class="hidden-xs">ID</th>
								<th class="hidden-xs">卡号</th>
								<th class="hidden-xs">密码</th>
								<th class="hidden-xs">状态</th>
								<th class="hidden-xs">是否绑定</th>
								<th class="hidden-xs">创建时间</th>
								<th class="hidden-xs">开始时间</th>
								<th class="hidden-xs">结束时间</th>
							</tr>
						</thead>
						<tbody>
						
						</tbody>
					</table>
					<div class="M-box3 page-style"></div>
				</div>
			</div>
		</div>
	</div>
</form>
<div class="check-alert">
	<div class="alert-box">
		<div class="icon-img"><i class="fa fa-times close-icon"></i></div>
		<div>
			<label>电话号码：</label>
			<input class="user-mobile" type="text" readonly="readonly" />
		</div>
		<div class="alert-btn">
			<button type="button" class="btn btn-primary view-mobile">查看手机号</button>
			<button type="button" class="btn btn-red relieve-bind">解除绑定</button>
		</div>
	</div>
</div>
<script>
	/**********************************************变量**********************************************/
	var pageNo = 1;    // 第几页
	var pageSize = 10;  // 每页几条
	var totalPage;     // 总页数
	var totalData;     // 总条数
	var username = GetQueryString("username");   // 用户姓名
	var token = MXCookie.get("token",token);     // 登陆token
	var str = '<tr align="center">'+
				'<td class="card-id"></td>'+
				'<td class="card-code"></td>'+
				'<td class="card-pwd"></td>'+
				'<td class="card-status"></td>'+
				'<td class="bind-status">'+
					'<button type="button" class="btn btn-xs bind-btn"></button>'+
				'</td>'+
				'<td class="create-time"></td>'+
				'<td class="start-time"></td>'+
				'<td class="end-time"></td>'+
			'</tr>';	
	/**********************************************事件**********************************************/
	// 查询
	$(".inquire-btn").click(function(){
		if($(".codeNum").val() == ""){
			getList();
			$(".page-style").show();
		}else{
			inquireCard();
			$(".page-style").hide();
		}
	});

	// 关闭弹框
	$(".close-icon").click(function(){
		$(".check-alert").fadeOut();
	});

	// 查看手机号
	$(".view-mobile").click(function(){
		var memberId = $(".check-alert").attr("data-id");
		checkMobile(memberId);
	});	

	// 解除绑定
	$(".relieve-bind").click(function(){
		askAlertBind('是否要解除绑定');
		$(".check-alert").hide();
		$(".check-alert input").val("");
		var bindId = $(".check-alert").attr("bind-id");
		var index = $(".check-alert").attr("data-index");
		$(".ask-alert").attr("data-id",bindId).attr("data-index",index);
	});

	// 确定解除绑定
	$("body").on("click",".relieve-sure",function(){
		var bindId = $(".ask-alert").attr("data-id");
		var index = $(".ask-alert").attr("data-index");	
		relieveBind(bindId,index);		
	});

	// 取消解除绑定
	$("body").on("click",".relieve-no",function(){
		$(".ask-alert").fadeOut();
	});	

	/**********************************************函数**********************************************/
	// 查询
	function inquireCard(){
		$.ajax({
			url: localStorage.grobalUrl + "/discount/searchDiscount",
			type: "post",
			async:false,
			data: {
				username: username,
				token: token,  
				pageNo: pageNo,   
				pageCount: pageSize,
				codeNum: $(".codeNum").val()
			},
			success: function(data){
				console.log(data);
				if(data[0]){
					$("tbody").html("");
					$("tbody").append(str);
					var cardVal = data[0];
					$(".card-id").text(cardVal.id);
					$(".card-code").text(cardVal.code_num);
					$(".card-pwd").text(cardVal.code);
					if(cardVal.member_id == null){
						$(".bind-btn").text("未绑定").addClass('btn-default');
					}else{
						$(".bind-btn").text("已绑定").addClass('btn-green').attr("data-id",cardVal.member_id);
					}
					
					if(cardVal.status == "USED"){
						$(".card-status").text("已使用");
					}else if(cardVal.status == "NOT_USE"){
						$(".card-status").text("未使用");
					}else if(cardVal.status == "LOCKED"){
						$(".card-status").text("已锁定");
					}

					$(".create-time").text(cardVal.creation_date);
					$(".start-time").text(cardVal.begin_date);
					$(".end-time").text(cardVal.end_date);	
					$(".bind-btn").click(function(){
						var index = $(".bind-btn").index(this);
						var bindId = $(".card-id").eq(index).text();
						if($(".bind-btn").eq(index).text() == "已绑定" && $(".card-status").eq(index).text() == "未使用"){
							var memberId = $(".bind-btn").eq(index).attr("data-id");
							$(".check-alert").fadeIn().attr("data-id",memberId).attr("bind-id",bindId).attr("data-index",index);	
							if($(".card-status").eq(index).text() == "已使用"){
								$(".check-alert").find(".relieve-bind").hide();
							}else{
								$(".check-alert").find(".relieve-bind").show();
							}					
						}else if($(".bind-btn").eq(index).text() == "未绑定"){
							tips("不满足解绑条件");
						}
					});										
				}else if(data.errCode == "00005"){
					tips("请重新登陆");
					setTimeout(function(){
						window.location.href = "login_login.html";
					},500);					
				}
									
			},
			error: function(err){
				console.log(error);
			}
		});
	}
	
	// 列表
	function getList(){
		$("tbody").html("");
		$.ajax({
			url: localStorage.grobalUrl + "/discount/discountExsBycounponId",
			type: "post",
			async:false,
			data:{
				username: username,
				token: token,  
				pageNo: pageNo,   
				pageCount: pageSize,
				counponId: $(".pageAdd").attr("data-id"),
			},
			success: function(data){
				if(data.errCode == "00001"){
					$("tbody").append("<tr><td align='center' colspan='8'>暂无数据</td></tr>");
				}else if(data.errCode == "00005"){
					tips("请重新登陆");
					setTimeout(function(){
						window.location.href = "login_login.html";
					},500);					
				}else{
					console.log(data);
					var dataVal = data.errMsg.list;
					totalPage = data.errMsg.totalPage;
					totalData = data.errMsg.totalRow;
					for(var i = 0; i < dataVal.length; i ++){
						var cardVal = dataVal[i];
						$("tbody").append(str);
						$(".card-id").eq(i).text(cardVal.id);
						$(".card-code").eq(i).text(cardVal.code_num);
						$(".card-pwd").eq(i).text(cardVal.code);
						if(cardVal.member_id == null){
							$(".bind-btn").eq(i).text("未绑定").addClass('btn-default');
						}else{
							$(".bind-btn").eq(i).text("已绑定").addClass('btn-green').attr("data-id",cardVal.member_id);
						}
						if(cardVal.status == "USED"){
							$(".card-status").eq(i).text("已使用");
						}else if(cardVal.status == "NOT_USE"){
							$(".card-status").eq(i).text("未使用");
						}else if(cardVal.status == "LOCKED"){
							$(".card-status").eq(i).text("已锁定");
						}

						$(".create-time").eq(i).text(cardVal.creation_date);
						$(".start-time").eq(i).text(cardVal.begin_date);
						$(".end-time").eq(i).text(cardVal.end_date);

					}

					$(".bind-btn").click(function(){
						var index = $(".bind-btn").index(this);
						var bindId = $(".card-id").eq(index).text();
						if($(".bind-btn").eq(index).text() == "已绑定"){
							var memberId = $(".bind-btn").eq(index).attr("data-id");
							$(".check-alert").fadeIn().attr("data-id",memberId).attr("bind-id",bindId).attr("data-index",index);	
							if($(".card-status").eq(index).text() == "已使用"){
								$(".check-alert").find(".relieve-bind").hide();
							}else{
								$(".check-alert").find(".relieve-bind").show();
							}							
						}else if($(".bind-btn").eq(index).text() == "未绑定"){
							tips("不满足解绑条件");
						}
											
					});			
				}
			},
			error: function(error){
				console.log(error);
			}
		});				
	}
	getList();
	
	// 分页
	if($("tbody>tr>td").text() == "暂无数据"){

	}else{
		pageSetGet();
	}
	
	// 解除绑定
	function relieveBind(bindId,index){
		$.ajax({
			url: localStorage.grobalUrl + "/discount/unBind",
			type: "post",
			data:{
				username: username,
				token: token, 
				id: bindId 				
			},
			success: function(data){
				console.log(data);
				if(data.errCode == "00000"){
					tips("解绑成功");
					$(".ask-alert").fadeOut();
					$(".bind-btn").eq(index).text("未绑定").addClass('btn-default').removeClass('btn-green');
				}else if(data.errCode == "00005"){
					tips("请重新登陆");
					setTimeout(function(){
						window.location.href = "login_login.html";
					},500);					
				}else{
					tips("解绑失败");
				}
			},
			error: function(err){
				console.log(err);
			}
		})
	} 


	// 查看手机号
	function checkMobile(memberId){
		$.ajax({
			url: localStorage.grobalUrl + "/discount/lookMoboileByUid",
			type: "post",
			data:{
				username: username,
				token: token, 
				uid: memberId 				
			},
			success: function(data){
				console.log(data);
				if(data){
					$(".user-mobile").val(data[0].mobile);
				}else if(data.errCode == "00005"){
					tips("请重新登陆");
					setTimeout(function(){
						window.location.href = "login_login.html";
					},500);					
				}else{
					tips("出现错误");
				}
			},
			error: function(err){
				console.log(err);
			}
		});
	}

	
	
</script>
